<template>
	<view class="tab-bar-box m-b-25">
		<view v-for="item, index in props.data.list" :key="index" class="tab-box" :style="hanldeStyle()"
			@click="hanldeClickTabNar(item)">
			<image class="img" :src="item.image"></image>
			<view class="title">{{ item.text }}</view>
		</view>
	</view>
</template>
<script setup lang="ts">
	import type { PageConfigItemsImgSlideType } from '@/core/models';
	import { handleAdvertiseDetail } from '@/core/utils';

	const props = withDefaults(defineProps<{
		data : any,
	}>(), {
		data: {},
	});

	const hanldeStyle = () => {
		return `width:${100 / (props.data.limit || 4)}%;`
	}

	const hanldeClickTabNar = (item : PageConfigItemsImgSlideType) => {
		handleAdvertiseDetail(Number(item.linkType), item.linkValue);
	}
</script>
<style lang="scss" scoped>
	@import './home-nav-bar.scss';
</style>